{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>stu_borrow</title>
    <link rel="stylesheet" href="{% static 'css/sqlTable.css' %}">
    <link rel="stylesheet" href="{% static 'css/navbar.css' %}">
    <link rel="stylesheet" href="{% static 'css/pagination.css' %}">
    <link rel="stylesheet" href="{% static 'css/search.css' %}">
    <script type="text/javascript" src="{% static 'js/click.js' %}"></script>
</head>
<body>
<body background="{% static 'img/book.jpg' %}" style="background-repeat:no-repeat ;background-size:100% 100%;background-attachment: fixed;">
    <!-- 导航栏 -->
    <div class="navbar">
        <div class="system-name">图书馆图书借阅系统——借阅记录</div>
        <nav class="menu">
            <a href="/stu_index" class="menu-item">系统首页</a>
            <a href="/stu_book" class="menu-item">借阅图书</a>
            <a href="/stu_borrow" class="menu-item">借阅记录</a>
            <a href="/stu_myBook" class="menu-item">已借图书</a>
            <a href="/stu_info" class="menu-item">个人中心</a>
        </nav>
        <div class="user-info">
            <img src="{{ stucc.avatar }}" class="user-avatar" alt="用户头像"/>
            <span class="username">欢迎您，同学：{{ stucc.stu_id }}</span>
            <a href="/login">
                <button class="button">退出</button>
            </a>
        </div>
    </div>
    <div class="search-bar">
        <form action="" method="post" name="search">
            {% csrf_token %}
            <input type="hidden" name="form_id" value="search">
            <input type="text" name="quest" placeholder="搜索借阅记录..." required>
            <select id="category" name="category">
                <option value="book_id">书籍号</option>
            </select>
            <input type="submit" value="搜索">
        </form>
        <p>
            {% if quest and category %}
            {% if category == 'book_id' %}
                搜索方式：书籍号
                搜索内容：{{ quest }}
            {% endif %}
        {% endif %}
        </p>
    <p style="color: red">
        {% if err %}
            {{ err }}
        {% endif %}
        </p>

    </div>
    <!-- 目录栏 -->
    <!-- 主内容区域 -->
    <div class= "container">
        <table>
            <thead>
                <tr>
                    <th>书籍号</th>
                    <th>借阅日期</th>
                    <th>应归还日期</th>
                    <th>归还日期</th>
                    <th>是否归还</th>
                </tr>
            </thead>
            <tbody>
                {% for bw in bw %}
                <tr>
                    <td>{{ bw.bookId_id }}</td>
                    <td>{{ bw.borrow_date }}</td>
                    <td>{{ bw.due_date }}</td>
                    <td>{{ bw.return_date }}</td>
                    <td>{{ bw.isReturn }}</td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
        <div class="pagination">
            <form method="get" action=".">
                {% csrf_token %}
                {% if bw.has_previous %}
                    <button type="submit" name="page" value="1">&laquo; 第一页</button>
                    <button type="submit" name="page" value="{{ bw.previous_page_number }}">上一页</button>
                {% endif %}

                <span class="current">
                    页码 {{ bw.number }} / {{ bw.paginator.num_pages }}
                </span>

                {% if bw.has_next %}
                    <button type="submit" name="page" value="{{ bw.next_page_number }}">下一页</button>
                    <button type="submit" name="page" value="{{ bw.paginator.num_pages }}">最后一页 &raquo;</button>
                {% endif %}
                {% if quest %}
                    <input type="hidden" name="quest" value="{{ quest }}">
                    <input type="hidden" name="category" value="{{ category }}">
                    <input type="hidden" name="form_id" value="search">
                {% endif %}
                </form>
        </div>
    </div>

</body>

</html>